<script lang="jsx">
/**
 * @author lilinjie
 * @Description:
 */

import { defineComponent, onMounted } from 'vue'
import { useInjectData } from '@/context/product/product'
import { useInjectSkuData } from '@/context/product/sku'

export default defineComponent({
  name: 'product-sku-modal',
  setup() {
    // 弹窗部分
    const {
      skuFilterForm,
      skuModelData,
      skuOnEdit,
      skuOnClickClose,
      skuOnClickConfirm,
      skuOnClickCreate,
      skuOnClickEdit,
      skuOnClickView
    } = useInjectSkuData()

    return () => {
      return (
          <div class="category-modal">
            <a-modal
                v-model:open={skuModelData.visible}
                onCancel={skuOnClickClose}
                onOk={skuOnClickConfirm}
            >
              <a-form
                  class="form"
                  disabled={skuModelData.isView}
                  style={{ marginTop: '20px' }}
                  label-col={{ span: 4 }}
                  wrapper-col={{ span: 19 }}
              >
                {skuModelData.isView &&
                    <a-form-item label="编号">
                      <a-input v-model:value={skuFilterForm.id} />
                    </a-form-item>
                }
                <a-form-item label="名称">
                  <a-input v-model:value={skuFilterForm.skuName} />
                </a-form-item>
                <a-form-item label="图片">
                  <a-input v-model:value={skuFilterForm.imgUrl} />
                </a-form-item>
                <a-form-item label="原产地">
                  <a-input v-model:value={skuFilterForm.origin} />
                </a-form-item>
                <a-form-item label="库存">
                  <a-input v-model:value={skuFilterForm.stockNum} />
                </a-form-item>
                <a-form-item label="售价">
                  <a-input v-model:value={skuFilterForm.salePrice} />
                </a-form-item>
                <a-form-item label="销量">
                  <a-input v-model:value={skuFilterForm.saleNum} />
                </a-form-item>
                <a-form-item label="重量">
                  <a-input v-model:value={skuFilterForm.weight} />
                </a-form-item>
              </a-form>
            </a-modal>
          </div>
      )
    }
  }
})
</script>

<style lang="less">
@import '@/assets/less/common-style.less';

.category-modal {

}
</style>
